@charset "utf-8";
@import "../base/conf";
/*===================================================*\
 * widget1
\*===================================================*/
.king-widget1{
    position:relative;
    padding:15px;
    background:#fff;
    border:1px solid #ddd;
    color:#5b5b5b;
    .fa-stack{
        font-size:30px;
        border-radius:50%;
        i{
            &.success{
                color:#5cb85c;
            }
            &.danger{
                color:#de3431;
            }
            &.info{
                color:#428bca;
            }
            &.warning{
                color:#ffce00;
            }
        }
    }
    .icon-wrap{float:left;margin-right:15px;}
    .text-wrap h3{padding:0;margin:5px 0;font-weight:600;font-size:20px;display:block;color:#4c5264;}
    .progress.progress-xs{height:5px;margin-top:25px;margin-bottom:20px;border-radius:0;box-shadow:none;}    
    &.king-widget-info{
        background: $infoBgColor;
        color: $infoFontColor;
    }
    &.king-widget-primary{
        background: $primaryBgColor;
        color: $primaryFontColor;
    }
    &.king-widget-success{
        background: $successBgColor;
        color: $successFontColor;
    }
    &.king-widget-warning{
        background: $warningBgColor;
        color: $warningFontColor;
    }
    &.king-widget-danger{
        background: $dangerBgColor;
        color: $dangerFontColor;
    }
}

/*===================================================*\
 * king-widget2
\*===================================================*/
.king-widget2{
    line-height:1.57142857;
    border-radius:3px;
    background-color:#ffffff;
    color:#444;
    margin-bottom:30px;
    position:relative;
    .cover{width:100%;}
    .widget-bordered{border: 1px solid #ddd; }
    .king-widget2-title{
        margin-top:0;color:#37474f;text-transform:capitalize;
        font-size:22px;
    }
    >.king-widget2-title{
        padding:12px 20px;
    }
    .king-widget2-header{
        border-radius:3px 3px 0 0;
        &:last-child{border-radius:inherit;}
    }
    .king-widget2-body{
        &:last-child{
            border-radius:0 0 3px 3px;
            .king-widget2-body-footer{border-radius:0 0 3px 3px;}
        }
        position:relative;padding:30px 25px;
    }
    .king-widget2-footer{
        border-radius:0 0 3px 3px;
        margin-top:30px;
        &:first-child{border-radiu:inherit;}
        &:before,&:after{content:" ";display:table;}
        &:after{clear:both;}
    }
    .king-widget2-content{
        ul{margin:0;padding:0;}
        li{list-style:none;}
    }
    .row.no-space{
        margin-left:0px;margin-right:0px;
        &>[class*=col-]{
            padding-left:0px;padding-right:0px;
        }
    }
    .king-counter-number{font-weight:300;}
    .height-300{height:300px;}
    .height-150{height:150px;}
    &.king-widget-info{
        background: $infoBgColor;
        color: $infoFontColor;
    }
    &.king-widget-primary{
        background: $primaryBgColor;
        color: $primaryFontColor;
    }
    &.king-widget-success{
        background: $successBgColor;
        color: $successFontColor;
    }
    &.king-widget-warning{
        background: $warningBgColor;
        color: $warningFontColor;
    }
    &.king-widget-danger{
        background: $dangerBgColor;
        color: $dangerFontColor;
    }
}

.king-widget2-metas{
    font-size:12px;
    &.type-link{
        >a{
            position:relative;display:inline-block;padding:3px 5px;color:#a3afb7;
            &:first-child{
                padding-left:0;
            }
            &a:hover{
                color:#ccd5db;
            }
            + a:before{
                position:absolute;top:10px;left:-2px;content:'';width:3px;height:3px;background-color:#a3afb7;border-radius:50%;
            }
        }
    }
}

.king-widget2-actions{
    margin-top:10px;text-align:right;
    a{
        display:inline-block;margin-right:10px;vertical-align:middle;color:#a3afb7;
        &.icon,.icon{
            text-decoration:none;
            + span{
                margin-left:2px;
            }
        }
        &.active,&:hover,&:focus{
            text-decoration:none;color:#ccd5db;
        }
        &:last-child{
            margin-right:0;
        }
    }
}
.king-widget2-actions-sidebar{
    width:60px;position:absolute;top:20px;left:20px;
    a{
        display:inline-block;width:100%;height:60px;text-align:center;border-right:1px solid #e4eaec;margin-right:0;
        &:before{
            display:inline-block;content:'';height:100%;vertical-align:middle;
        }
        + a{border-top:1px solid #e4eaec;}
    }
    + .king-widget2-content{margin-left:80px;}
}
.king-widget2-watermark{
    position:absolute;opacity:0.1;right:0;bottom:0;line-height:1;
    &.darker{color:black;}
    &.lighter{color:white;}
}
.king-widget2-left{
    position:absolute;width:40%;height:100%;top:0;left:0;
    + .king-widget2-body{margin-left:40%;width:60%;}
}
@media (max-width:767px){
    .king-widget2-left{
        position:relative;width:100%;height:320px;
        + .king-widget2-body{margin-left:0;width:100%;}
    }
}
.king-counter{
    text-align:center;
    >.king-counter-number,.king-counter-number-group{font-size:20px;}
    .king-counter-label{display:block;}
    .king-counter-icon{font-size:20px;}
}
@mixin king-counter-type-create($size){
    > .king-counter-number,.king-counter-number-group{font-size:$size;}
    .king-counter-icon{font-size:$size;}
}
.king-counter-lg{
    @include king-counter-type-create(40px)
}
.king-counter-md{
    @include king-counter-type-create(30px)
}
.king-counter-sm{
    @include king-counter-type-create(14px)
}
.king-counter-sm .king-counter-number-related + .king-counter-number,.king-counter-sm .king-counter-number + .king-counter-number-related{margin-left:0;}

.vertical-align{
    font-size:0;
    &:before{display:inline-block;height:100%;vertical-align:middle;content:"";}
    .vertical-align-middle,.vertical-align-bottom{display:inline-block;max-width:100%;font-size:14px;}
    .vertical-align-middle{vertical-align:middle;}
    .vertical-align-bottom{vertical-align:bottom;}
}
.king-nav-boxed{
    box-shadow:0 0 2px rgba(0,0,0,.2);background-color:#fff;border-radius:4px;
    a{color:#333;text-decoration:none;}
    &.nav-justified>li>a{margin:0}
    &>li{
        >a{
            display:block;padding:10px 5px;border-left:0;border-top:1px solid #f3f3f3;
            i{display:block;width:40px;height:40px;line-height:40px;margin:0 auto 2px;font-size:30px}
        }
        &:first-child>a{border-left:none;border-top:0}
    }
}



.king-widget2-shadow{-webkit-box-shadow:0 1px 1px rgba(0,0,0,0.05);box-shadow:0 1px 1px rgba(0,0,0,0.05);}
.overlay-background .king-widget2-time{opacity:0.8;color:#ffffff;}
.king-widget2-category{font-size:16px;}
.king-widget2-divider:after{width:20px;height:2px;content:"";display:block;margin:15px auto;background-color:#ffffff;}
@media (min-width:768px){
    .king-nav-boxed>li>a{border-top:0;border-left:1px solid #f3f3f3}
}
@media (min-width:768px){
    .king-nav-boxed>li:first-child>a{border-left:1px solid #f3f3f3}
}
/*===================================================*\
 * king-widget2
\*===================================================*/
.king-card{
    max-height: 245px;
    .king-colum-contain{display: block;overflow: hidden;background: #fff;}
    .king-colum-img{max-width: 100%;}
    .king-colum-desc{
        display: table;
        .king-desc-contain{
            display: table-cell;vertical-align: top;max-height: 195px;
            a{
                color: #0095eb;
                &:hover{text-decoration: underline}
            }
        }
    }
}


/*===================================================*\
 *king-widget7
\*===================================================*/
@mixin king-panel-color($BgColor){
    color: #FFF;
    text-align: center;
    color: #FFF;

    .king-panel-left{
        height: 120px;
        float: left;
        padding: 30px 0;
        width: 30%;
        background: $BgColor;
    }
    .king-panel-right{
        height: 120px;
        float: left;
        padding: 30px 0;
        width: 70%;
        background: lighten($BgColor,5%);
    }
}

.king-panel-item.king-panel-success{
    @include king-panel-color($successBgColor);
}
.king-panel-item.king-panel-info{
    @include king-panel-color($infoBgColor);
}
.king-panel-item.king-panel-primary{
    @include king-panel-color($primaryBgColor);
}
.king-panel-item.king-panel-warning{
    @include king-panel-color($warningBgColor);
}
.king-panel-item.king-panel-danger{
    @include king-panel-color($dangerBgColor);
}

/*===================================================*\
 *king-widget8
\*===================================================*/

.king-widget8{
    border: 1px solid #ddd;
    .widget-item{
        margin-bottom: 10px;
        strong{
            color: #444;
            vertical-align: middle;
        }
        .widget-icon{
            width: 13px;
            height: 13px;
            display: inline-block;
            vertical-align: middle;
            margin-right: 5px;
        }
    }

}
.king-widget3{
    &.king-widget-info{
        background: $infoBgColor;
        color: $infoFontColor;
    }
    &.king-widget-primary{
        background: $primaryBgColor;
        color: $primaryFontColor;
    }
    &.king-widget-success{
        background: $successBgColor;
        color: $successFontColor;
    }
    &.king-widget-warning{
        background: $warningBgColor;
        color: $warningFontColor;
    }
    &.king-widget-danger{
        background: $dangerBgColor;
        color: $dangerFontColor;
    }
}
.king-width-100{
    width: 100%;
}
/*===================================================*\
 *king-widget9
\*===================================================*/
.king-widget9{
    display: table;
    width: 100%;
    table-layout: fixed;
    border-collapse: separate;
    background: #393939;
    color: #fff;
    padding: 55px 0; 
    & .king-widget9-content{
        margin: 0 auto;
        display: table-cell;
        float: none;
        border-right: 3px solid #2d2d2d;
        padding:0;
        & > div{
            width: 275px;
            margin: 0 auto; 
        }  
    }
    & .king-icon-wrap{
        float: right;
        text-align: center;
        span{ 
            display: inline-block; 
            width: 86px; 
            height: 86px;
            border-radius: 50%;
            line-height: 86px;
            i{ 
                width: 100%; 
                text-align: center; 
                vertical-align: middle; 
                font-size: 38px; 
                margin: 0;
            }
        }
        h5{
            font-size: 16px;
            font-weight: normal;
            margin: 20px 0 0 0;
        }
    }
    & .king-text-wrap{
        float: left;
        h2{
            margin:0 0 25px 0;
            font-weight:normal;
            font-size: 30px;
        }  
    }
    & .text-wrap{
            display: inline-block;
            text-align: left;
            .text-wrap-left{
                float: left;
                margin-right: 20px;
                font-size:12px;
            }
            .text-wrap-right{
                float: right;
                font-size:12px;
            }
            p{
            margin:0;
            }
            
        } 
    & .king-widget9-content:last-child{
        border:0;
    }
    
    & .king-widget-info{
        background: $infoBgColor;
        color: $infoFontColor;
    }
    & .king-widget-primary{
        background: $primaryBgColor;
        color: $primaryFontColor;
    }
    & .king-widget-success{
        background: $successBgColor;
        color: $successFontColor;
    }
    & .king-widget-warning{
        background: $warningBgColor;
        color: $warningFontColor;
    }
    & .king-widget-danger{
        background: $dangerBgColor;
        color: $dangerFontColor;
    }
}
